<script>
import GoodsBaseSetting from "@/components/goods/GoodsBaseSetting.vue";
import GoodsDetailSetting from "@/components/goods/GoodsDetailSetting.vue";
import message from "@/tools/Message";
import GoodsPriceSetting from "@/components/goods/GoodsPriceSetting.vue";

export default {
	name: "AddGoods",
	components: {
		BaseSetting: GoodsBaseSetting,
		PriceSetting:GoodsPriceSetting,
		DetailSetting:GoodsDetailSetting
	},
	data(){
		return {
			activeTab: "1"
		}
	},
	methods: {
		handleClick(tab) {
			message.success("切换Tab: " + tab.props.label)
		}
	}
}
</script>

<template>
	<div class="content-container">
		<el-tabs v-model="activeTab" @tab-click="handleClick">
			<el-tab-pane label="基础设置" name="1">
				<base-setting v-bind="$attrs"></base-setting>
			</el-tab-pane>
			<el-tab-pane label="价格库存" name="2">
				<price-setting v-bind="$attrs"></price-setting>
			</el-tab-pane>
			<el-tab-pane label="商品详情" name="3">
				<detail-setting v-bind="$attrs"></detail-setting>
			</el-tab-pane>
		</el-tabs>
	</div>
</template>

<style scoped>
.content-container{
	margin: 0;
	width: 100%;
	min-width: 100%;
	box-sizing: border-box;
	padding: 0 20px;
}
</style>